<template>
    <rx-dialog @handOk="handleSubmit" @cancel="cancel">
        <rx-layout>
            <div slot="center">
                <a-form :form="form">
                    <a-form-item style="display:none">
                        <a-input v-decorator="['instId']"/>
                        <a-input v-decorator="['relTypeId']"/>
                        <a-input v-decorator="['instId']"/>
                        <a-input v-decorator="['party1']"/>
                        <a-input v-decorator="['dim1']"/>
                        <a-input v-decorator="['party2']"/>
                        <a-input v-decorator="['dim2']"/>
                        <a-input v-decorator="['isMain']"/>
                        <a-input v-decorator="['status']"/>
                        <a-input v-decorator="['relType']"/>
                        <a-input v-decorator="['relTypeKey']"/>
                        <a-input v-decorator="['path']"/>
                    </a-form-item>
                    <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$ti18('rxForm.name','名称')">
                        <a-input :placeholder="$ti18('rxForm.name','名称')"
                                 v-decorator="['alias', {rules: [{required: true, message: $ti18('rxForm.name','名称','', 'input')}]}]"/>
                    </a-form-item>
                    <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="i18n('form.currentGroup','当前组')">
                        <a-input :placeholder="i18n('form.currentGroup','当前组')" readOnly
                                 v-decorator="['party1Name', {rules: [{required: true, message: i18n('form.currentGroup','当前组','input')}]}]"/>

                    </a-form-item>
                    <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="i18n('form.relationGroup','关联组')">
                        <a-input-group v-if="instId==''" compact style="display: flex;margin-top: 6px;">
                            <a-input readOnly
                                     v-decorator="['party2Name', {rules: [{required: true, message: i18n('form.relationGroup','关联组','select')}]}]"
                                     style="flex: 1;"/>
                            <a-button @click="openGroup" style="width: 50px">·&nbsp;·&nbsp;·</a-button>
                        </a-input-group>
                        <a-input-group v-if="instId !=''" compact style="display: flex;margin-top: 6px;">
                            <a-input readOnly
                                     v-decorator="['party2Name', {rules: [{required: true, message: i18n('form.relationGroup','关联组','select')}]}]"
                                     style="flex: 1;"/>
                        </a-input-group>
                    </a-form-item>
                </a-form>
            </div>
        </rx-layout>
    </rx-dialog>
</template>
<script>
import OsRelInstApi from '@/api/user/org/osRelInst'
import {pick} from 'lodash-es'
import {BaseForm, RxDialog, RxLayout, Dialog} from "@lowcode/jpaas-common-lib";
import OsGroupApi from "@/api/user/org/osGroup";
import osRelInstApi from "@/api/user/org/osRelInst";
//目前只支持relType=GROUP-GROUP即party1为组id,party2为组id的新增和编辑，其余类型如需支持需要调整
export default {
    name: 'OsRelInstEdit',
    mixins: [BaseForm],
    components: {
        RxDialog,
        RxLayout
    },
    props: {
        "instId": {// 关系实例ID
            type: String,
            default: ''
        },
        "relTypeId": {//关系定义-ID
            type: String,
            default: ''
        },
        "relTypeKey": {//关系定义-key
            type: String,
            default: ''
        },
        "relType": {//关系定义-类型
            type: String,
            default: ''
        },
        "relTypeDimId2": {//关系定义-关联方维度ID
            type: String,
            default: ''
        },
        "dimId": { //用户组-维度ID
            type: String,
            default: ''
        },
        "groupId": {//用户组id
            type: String,
            default: ''
        },
        "groupName": {//用户组名称
            type: String,
            default: ''
        },
        "tenantId": {//租户ID
            type: String,
            default: ''
        },
    },
    data() {
        return {
            visible: false,
            labelCol: {
                xs: {span: 24},
                sm: {span: 5}
            },
            wrapperCol: {
                xs: {span: 24},
                sm: {span: 16}
            },
            formData: {
                instId: '',
                relTypeId: '',
                relTypeKey: '',
                relType: '',
                party1: '',
                dim1: '',
                party2: '',
                dim2: '',
                isMain: 'NO',
                status: 'ENABLED',
                alias: '',
                party1Name: '',
                party2Name: '',
                path: '',
            },
            groupData:{}
        }
    },
    beforeCreate() {
    },
    created() {
       // this.initData();
    },
    methods: {
        i18n(name,text,key){
            return this.$ti18(name,text,"OsRelInst",key);
        },
        initData() {
            if (this.instId) {
                OsRelInstApi.get(this.instId).then(resp => {
                    this.formData = pick(resp.data, 'instId', 'relTypeId', 'party1', 'dim1', 'party2', 'dim2', 'isMain', 'status', 'relType', 'tenantId', 'alias', 'party1Name', 'party2Name');
                })
            }
        },
        onload_(){
            this.formData.relTypeId = this.relTypeId;
            this.formData.relType = this.relType;
            this.formData.relTypeKey = this.relTypeKey;
            this.formData.party1 = this.groupId;
            this.formData.dim1 = this.dimId;
            this.formData.party1Name = this.groupName;
            this.formData.tenantId = this.tenantId;
            this.mdl = Object.assign(this.formData);
            this.form.setFieldsValue(this.mdl)
        },

        get(id) {
            return OsRelInstApi.get(id)
        },
        save(values) {
            if (!values.instId && this.tenantId) {
                values.tenantId = this.tenantId;
            }
            return OsRelInstApi.saveOrUpdateOsRelInst(values)
        },
        openGroup() {
            let _self = this;
            let params = {single: true, dimId: this.relTypeDimId2, showDimId: true};
            Dialog.openGroupDialog({
                curVm: this, data: params, widthHeight: ['900px', '600px']
            }, function (self, groups) {
                if (groups == null) {
                    self.$message.error(_self.i18n('msa.noSelGroupTips','未选择用户组！'));
                    return;
                }
                let param = {
                    party2: groups.groupId,
                    party2Name : groups.name,
                    path : "0." + _self.formData.party1 + "." + _self.formData.party2 + ".",
                };
                let alias =_self.form.getFieldValue('alias');
                if(!alias){
                    param.alias = _self.mdl.party1Name+"-"+groups.name//默认别名;
                }
                _self.form.setFieldsValue(param);
            })
        },
    },
    watch: {
        'mdl.party1': function (val, oldVal) {
            if (val && val != oldVal) {
                let group = this.groupData[val];
                if(group){
                    this.form.setFieldsValue({
                        party1Name: group.name
                    })
                }else{
                    OsGroupApi.getOsGroup(val).then(resp => {
                        this.groupData[val] = resp.data;
                        this.form.setFieldsValue({
                            party1Name: resp.data.name
                        })
                    })
                }

            }
        },
        'mdl.party2': function (val, oldVal) {
            if (val && val != oldVal) {
                let group = this.groupData[val];
                if(group){
                    this.form.setFieldsValue({
                        party2Name: group.name
                    })
                }else{
                    OsGroupApi.getOsGroup(val).then(resp => {
                        this.groupData[val] = resp.data;
                        this.form.setFieldsValue({
                            party2Name: resp.data.name
                        })
                    })
                }

            }
        },
    }
}
</script>
